<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">		
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link rel="stylesheet" type="text/css" href="css/wodeyinyue.css"/>
		<script type="text/javascript"src="js/wodeyinyue.js" ></script>		
		<title>我的音乐</title>
	</head>
	<body>
		<!--汉堡按钮弹窗-->
		<div id="dianji"  onClick="msgbox(1)">
			<div id="d1"></div>
			<div id="d2"></div>
			<div id="d3"></div>
		</div>		
		<!--导航回首页-->
		<div id="daohang">
			<a href="index.html"><div id="top1">发现音乐</div></a>
			<a href="index2.html"><div id="top2">我的音乐</div></a>
			<a href="index3.html"><div id="top3">推荐音乐</div></a>
		</div>
		
		<!--个人头像，头部-->
		<div id="Wtoubu">
			<div id="wtouxiang"><img src="img/d6.jpg" ></div>
			<div id="wmingzi">
				<div id="w1">大蛇_sW1c</div>
				<div id="w2">VIP 开通</div>
				<div id="w3">Lv.10</div>
			</div>			
			<div id="wyou">  >  </div>
		</div>
		<!--锚点跳动-->
		<div id="maodian">
			<a href="#maodian1"><div id="maodian1">收藏音乐</div></a>
			<a href="#maodian2"><div id="maodian2">历史播放</div></a>
			<a href="#maodian3"><div id="maodian3">喜欢专辑</div></a>
		</div>
		<!--收藏音乐-->		
		<a name="maodian1">
			<div id="shoucangyinyue">
				<div id="hezi">				
				<div id="shouchang1"><img src="img/minyao4.jpg"  onclick="return false"></div>
				<div id="shouchang2">直觉（温柔少女版）（翻自 王珂珂）</div>
				<div id="shouchang3"><audio src="video/胖虎%20-%20直觉%20(Live片段).mp3" controls="controls" ></audio></div>			
				</div>
				<div id="hezi">
				<div id="shouchang1"><img src="./img/d3.jpg"  onclick="return false"></div>
				<div id="shouchang2">绅士——（薛之谦）</div>
				<div id="shouchang3"><audio src="video/薛之谦%20-%20绅士.mp3" controls="controls" ></audio></div>			
				</div>
				<div id="hezi">
				<div id="shouchang1"><img src="img/dianyin6.jpg" onclick="return false" ></div>
				<div id="shouchang2">ILLENIUM</div>
				<div id="shouchang3"><audio src="video/ILLENIUM、RUNN%20-%20Free%20Fall.mp3" controls="controls" ></audio></div>			
				</div>
				<div id="hezi">
				<div id="shouchang1"><img src="img/minyao3.jpg" onclick="return false" ></div>
				<div id="shouchang2">小宇（胖虎）</div>
				<div id="shouchang3"><audio src="video/胖虎%20-%20小宇%20(片段).mp3" controls="controls" ></audio></div>			
				</div>
				<div id="hezi">
				<div id="shouchang1"><img src="img/dianyin5.jpg" onclick="return false" ></div>
				<div id="shouchang2">热爱105°C的你</div>
				<div id="shouchang3"><audio src="video/阿肆%20-%20热爱105°C的你.mp3" controls="controls" ></audio></div>			
				</div>
				<div id="hezi">
				<div id="shouchang1"><img src="img/dianyin1.jpg" onclick="return false" ></div>
				<div id="shouchang2">飘向北方(Live)</div>
				<div id="shouchang3"><audio src="video/尤长靖、那吾克热-NW%20-%20飘向北方%20(Live).mp3" controls="controls" ></audio></div>			
				</div>
				<div id="hezi">
				<div id="shouchang1"><img src="img/minyao6.jpg"  onclick="return false"></div>
				<div id="shouchang2">叹云兮（鞠婧祎）</div>
				<div id="shouchang3"><audio src="video/鞠婧祎%20-%20叹云兮.mp3" controls="controls" ></audio></div>			
				</div>
				<div id="hezi">
				<div id="shouchang1"><img src="img/dianyin3.jpg" onclick="return false" ></div>
				<div id="shouchang2">朗朗晴天</div>
				<div id="shouchang3"><audio src="video/Sou%20-%20ハレハレヤ%20(朗朗晴天).mp3" controls="controls" ></audio></div>			
				</div>
			</div>			
		</a>
		<!--历史播放-->
		<a name="maodian2">
			<div id="lishibofang">
				<div id="zuijinbofang">&nbsp;&#9654;最近播放</div>
				<div id="kuang">
					<div id="kuang1">&emsp;&emsp;音乐标题</div>
					<div id="kuang2">歌手</div>
					<div id="kuang3">播放时间</div>
				</div>
				<div id="kuang">
					<div id="kuang1">01&emsp;我很好</div>
					<div id="kuang2">刘大壮</div>
					<div id="kuang3">3分钟前</div>
				</div>
				<div id="kuang">
					<div id="kuang1">02&emsp;患</div>
					<div id="kuang2">姜云升</div>
					<div id="kuang3">3分钟前</div>
				</div>
				<div id="kuang">
					<div id="kuang1">03&emsp;自白书</div>
					<div id="kuang2">姜云升</div>
					<div id="kuang3">4分钟前</div>
				</div>
				<div id="kuang">
					<div id="kuang1">04&emsp;玫瑰</div>
					<div id="kuang2">吴炳文</div>
					<div id="kuang3">8分钟前</div>
				</div>
				<div id="kuang">
					<div id="kuang1">05&emsp;星辰大海</div>
					<div id="kuang2">黄霄雲</div>
					<div id="kuang3">8分钟前</div>
				</div>
				<div id="kuang">
					<div id="kuang1">06&emsp;篝火旁</div>
					<div id="kuang2">吕大叶</div>
					<div id="kuang3">10分钟前</div>
				</div>
				<div id="kuang">
					<div id="kuang1">07&emsp;DaDaDance</div>
					<div id="kuang2">Yamy</div>
					<div id="kuang3">12分钟前</div>
				</div>
				<div id="kuang">
					<div id="kuang1">08&emsp;我爱他</div>
					<div id="kuang2">是二智呀</div>
					<div id="kuang3">13分钟前</div>
				</div>				
			</div>			
		
		<!--历史播放-->
		<a name="maodian3">
			
			<div id="zhuanjituijian">
				<div id="zuijinbofang">&nbsp;&#9654;喜欢专辑</div>								
				<div id="zhuanjikuang">
					<div id="zhuanji1" onClick="msgvio(1)" ><img src="img/d10.jpg"  onclick="return false"></div>
					<div id="zhuanji2" onClick="msgvoo(1)"><img src="img/d11.jpg"  onclick="return false"></div>
					<div id="zhuanji3" onClick="msgvii(1)"><img src="img/d4.jpg"  onclick="return false"></div>					
				</div>				
				</div>
				<div id="vio" >
					<audio  src="video/薛之谦%20-%20绅士.mp3"controls="controls"></audio>
				</div>
				<div id="voo" >
					<audio  src="video/封茗囧菌%20-%20东京不太热.mp3"controls="controls"></audio>
				</div>
				<div id="vii" >
					<audio  src="video/尤长靖、那吾克热-NW%20-%20飘向北方%20(Live).mp3"controls="controls"></audio>
				</div>
			</div>
		</a>
		<!--js播放按钮显示-->
		<script>
		function msgvio(n){
		document.getElementById('vio').style.display=n?'block':'none'; /* 点击按钮打开/关闭 对话框 */
		}
		</script>
		<!--js播放按钮显示-->
		<script>
		function msgvoo(n){
		document.getElementById('voo').style.display=n?'block':'none'; /* 点击按钮打开/关闭 对话框 */
		}
		</script>
		<!--js播放按钮显示-->
		<script>
		function msgvii(n){
		document.getElementById('vii').style.display=n?'block':'none'; /* 点击按钮打开/关闭 对话框 */
		}
		</script>
		<!--js关闭弹窗-->
		<script>
		function msgbox(n){
		document.getElementById('inputbox').style.display=n?'block':'none'; /* 点击按钮打开/关闭 对话框 */
		}
		</script>
		<!--窗口弹出列表框-->
		<div id='inputbox' class="box">
			<a class='x' href=''; onclick="msgbox(0); return false;">×</a>
			<div id="box1">
				<div id="boximg"><img src="img/d6.jpg"  onclick="return false"></div>
				<div id="boxwenzi">
					大蛇·音乐 >
				</div>			
			</div>
			<div id="box2">
				<div id="box2wenzi1">
					曼巴 VIP
				</div>
				<div id="box2wenzi2">
					限时优惠！曼巴首月0元！&emsp;&emsp;    &#127925;
				</div>
			</div>
			<div id="box3">
				<div id="box31">&#9993;&nbsp;我的消息&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&nbsp;&emsp;&emsp;></div>  
				<div id="box32">&#127911;&nbsp;我的签到&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;></div>
				<div id="box33">&#127926;&nbsp;创造中心&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;></div>				
			</div>
			<div id="box4">
				<div id="box41">音乐服务</div>
				<div id="box42">&#128722;商城&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;></div>
				<div id="box43">&#127918;游戏专区&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;></div>
				<div id="box44">&#127925;音乐铃声&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;></div>
			</div>
			<div id="box5">
				<div id="box51">音乐服务</div>
				<div id="box52">&#128736;设置&nbsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;></div>
				<div id="box52">&#128347;定时关闭&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;></div>
				<div id="box52">&#128302;个性装扮&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;></div>
				<div id="box52">&#128279;边听边存&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;></div>
				<div id="box52">&#128519;在线免流&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;></div>
				<div id="box52">&#128420;音乐黑名单&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;></div>
				<div id="box52">&#128515;青少年模式&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;></div>
				<div id="box52">&#128356;音乐闹钟&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;></div>
			</div>
			<div id="box6">
				退出登录/关闭
			</div>
		</div>
		
	</body>
</html>
